<%--
  Created by IntelliJ IDEA.
  User: 谭真真的电脑
  Date: 2020/6/10
  Time: 11:25
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>注册</title>
    <link type="text/css" rel="stylesheet" href="css/zhuce.css" />
    <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
    <script type="text/javascript">


        $(document).ready(function () {
            var height=$(document).height();
            $('.main').css('height',height);
        })

    </script>
</head>

<body>
<form method="post" action="http://localhost:8080/webtest/reg" name="form1" id="form1" onsubmit="return check()">
    <div class="main">
        <div class="main0">
            <div class="main_left">
                <img src="images/zhuce-image-3.png" class="theimg"/>
                <img src="images/zhuce-image-2.png" class="secimg"/>
                <img src="images/zhuce-image-1.png" class="firimg"/>
            </div>
            <div class="main_right">
                <div class="main_r_up">
                    <img src="images/logo.png" />
                    <div class="pp"></div>
                </div>
                <div class="sub"><p>已经注册？<a href="login.jsp"><span class="blue">请登录</span></a></p></div>
                <div class="txt">
                    <span style="letter-spacing:10px;">手机号:</span>
                    <input name="phone" type="text" class="txtphone" onblur="valiPhone(this)" placeholder="请输入手机号码"/>
                </div>
                <div class="txt">
                    <span style="letter-spacing:18px;">密码:</span>
                    <input name="pwd" type="password" class="txtphone" onblur="vailPassword(this)" placeholder="请输入密码"/>
                </div>
                <div class="txt">
                    <span style="letter-spacing:5px;">真实姓名:</span>
                    <input name="truename" type="text" class="txtphone" onblur="valiTrueName(this)" placeholder="请输入真实姓名"/>
                </div>
                <div class="txt">
                    <span style="letter-spacing:18px;">邮箱:</span>
                    <input name="email" type="text" class="email" onblur="valiemail(this)" placeholder="请输入邮箱"/>
                </div>

                <div class="txt">
                    <span style="letter-spacing:10px;">验证码:</span>
                    <input name="vali" type="text" class="vail"  placeholder="邮箱获取验证码"/>
                </div>

                <div class="xiayibu">
                    <input style="width:260px; height:40px;  color:#fff; background:green; border: green"
                           type="button"  value="获取验证码" onclick="getident()"/>
                </div>

                <div class="xiayibu">
                    <input style="width:260px; height:40px;  color:#fff; background:green; border: green"
                           type="submit"  value="下一步 >"/>
                </div>
            </div>
        </div>
    </div>


    <script>

        function check() {

            document.form1.action="http://localhost:8080/webtest/reg";

            var phone=document.form1.elements[0].value;
            var pwd=document.form1.elements[1].value;
            var truename=document.form1.elements[2].value;
            var email=document.form1.elements[3].value;
            var vail=document.form1.elements[4].value;

            var flag=true;

            var s="";

            var form=/^[a-zA-Z0-9_-]+@([a-zA-Z0-9]+\.)+(com|cn|net|org)$/;      //电子邮箱的正则表达式
            if(email.length>0) {
                if (!form.test(email)) {
                    s+="邮箱填写不符合标准，";
                    flag=false;
                }
            }

            form=/[0-9]*/;

            if (!form.test(phone)||phone.length!=11) {
                s+="电话号码填写不符合标准，"
                flag=false;
            }


            if(pwd.length<6){
                s+="密码填写不符合标准，"
                flag=false;
            }

            var re=/^[\u4E00-\u9FA5]+$/;    //汉字的编码 正则表达式
            if (!re.test(truename)){
                s+="真实姓名填写不符合标准，";
                flag=false;
            }

            if(vail.length==0){
                s+="验证码不能为空，"
                flag=false;
            }

            if(flag==false){
                s+="请重新填写."
                alert(s)}
            return flag;




        }

        function valiemail(obj) {
            var txt=obj.value;
            var form=/^[a-zA-Z0-9_-]+@([a-zA-Z0-9]+\.)+(com|cn|net|org)$/;      //电子邮箱的正则表达式
            if(txt.length>0) {
                if (!form.test(txt)) {
                    alert("邮箱格式不符合标准，请重新填写！");
                }
            }


        }

        function valiTrueName(obj) {
            var txt=obj.value;
            var re=/^[\u4E00-\u9FA5]+$/;    //汉字的编码 正则表达式
            if (!re.test(txt)){
                alert("真实姓名必须是汉字！");
            }

            if( txt.length==0||txt.length>10){
                alert("真实姓名长度不符合标准，请重新填写！")
            }

        }

        function vailPassword(obj) {
            var txt=obj.value;
            if(txt.length<6){
                alert("密码位不少于6位的字符串")
            }

        }


        function valiPhone(obj) {
            var txt=obj.value;
            var form=/[0-9]*/;

            if (!form.test(txt)||txt.length!=11) {
                alert("电话号码为11位数字");
            }
        }

        function getident() {
            document.form1.action="http://localhost:8080/webtest/identify";
            var email=document.form1.elements[3].value;
            var form=/^[a-zA-Z0-9_-]+@([a-zA-Z0-9]+\.)+(com|cn|net|org)$/;      //电子邮箱的正则表达式
            var flag=true;
            if(email.length==0){
                flag=false;
                alert("验证码将发送至你的邮箱，请先填入邮箱");
            }
            if(email.length>0) {
                if (!form.test(email)) {
                    alert("邮箱填写不符合标准");
                    flag=false;
                }
            }
            if(flag)
                document.form1.submit();
        }
    </script>
</form>
</body>
</html>
